<!-- 用于有多组数据需要判断不同的场景 -->
<template>
  <div v-if="isShowTip" class="contrast-info-tiptool-wrap">
    <el-popover
      placement="top"
      trigger="hover">
      <div style="display: flex;">
        原订单：<slot v-if="isShowTip" name="tipContent"/>
      </div>
      <i slot="reference" class="el-icon-warning info-button" />
    </el-popover>
  </div>
</template>
<script>
import { getTargetData } from '@/utils';
export default {
  name: 'MulContrastInfoTipTool',
  props: {
    /**
    **dataGroup的结构为
    **{ originData: Object, newData: Object, correlateFiled: Array }[]
    **/
    dataGroup: {
      type: Array,
      default: () => {
        return [];
      }
    }
  },
  computed: {
    isShowTip() {
      let isDiff = false;
      let isObjectQualified = true;
      for (var i = 0; i < this.dataGroup.length; i++) {
        const correlateFiled = this.dataGroup[i].correlateFiled;
        const newData = this.dataGroup[i].newData;
        const originData = this.dataGroup[i].originData;
        if (!(originData && JSON.stringify(originData) !== '{}')) {
          isObjectQualified = false;
        }
        correlateFiled.forEach(filed => {
          if (this.getTargetData(newData, filed) !== this.getTargetData(originData, filed)) {
            isDiff = true;
          }
        });
      }
      return isObjectQualified && isDiff;
    }
  },
  methods: {
    getTargetData
  }
};
</script>
<style lang="scss" scoped>
.contrast-info-tiptool-wrap {
  display: inline-block;
}
.info-button {
  color: #F56C6C;
  cursor: pointer;
}
</style>
